<!--  -->
<template>
    <div style="width:100%;height:100%;background-color:#fff;overflow-x:auto;">
        <!-- <a-split :style="{
            height: '100%',
            width: '100%',
            minWidth: '100%',
            border: '1px solid var(--color-border)'
        }" v-model:size="sizes" min="500px">
            <template #first> -->
        <div style="width:100%;display:flex;justify-content:space-between;">
            <a-space><a-form-item label="织布单号">
                    <a-input allow-clear class="bacClass" v-model="letfObj.planOrderCode" :style="{ width: '150px' }" />
                </a-form-item>
                <a-form-item label="机台号">
                    <a-input allow-clear class="bacClass" v-model="letfObj.machineCode" :style="{ width: '150px' }" />
                </a-form-item>
                <a-form-item label="生产单号">
                    <a-input allow-clear class="bacClass" v-model="letfObj.weavingCode" :style="{ width: '150px' }" />
                </a-form-item></a-space>
            <div>
                <a-space>
                    <a-button type="primary" @click="seleCtLeft">查询</a-button>
                    <a-button type="primary" @click="rowClickeds">修改排程</a-button>
                    <a-button type="primary" @click="zjtClicks">增加机台</a-button>
                    <a-button type="primary" @click="zjtClick">转机台</a-button>
                    <!-- <a-button type="primary" @click="zjtbc">保存</a-button> -->
                    <a-button type="primary" @click="ztClick">暂停标识</a-button>
                </a-space>
            </div>
        </div>
        <AgGridVuesCopys :rowHeight="33" :headerHeight="33" :suppressCopyRowsToClipboard="true"
            :suppressDragLeaveHidesColumns="true" rowSelection="single" @grid-ready="gridReady" style="height:92%"
            :defaultColDef="defaultColDef" class='ag-theme-alpine' :rowData="agClousData" :columnDefs="agClous"
            :localeText="localeText1" :gridOptions="gridOptions">
        </AgGridVuesCopys>
        <!-- </template>
            <template #second>
                <div style="width:100%;height: 32px;">
                    <div style="margin-bottom:5px;margin-left:20px"> -->
        <!-- <a-space>
                            <a-button type="primary" @click="zjtClicks">增加机台</a-button>
                            <a-button type="primary" @click="zjtClick">转机台</a-button>
                            <a-button type="primary" @click="zjtbc">保存</a-button>
                            <a-button type="primary" @click="ztClick">暂停</a-button>
                        </a-space> -->
        <!-- </div>
                </div>
                <AgGridVuesCopys :rowDragManaged="true" :animateRows="true" :rowHeight="33" :headerHeight="33"
                    :suppressCopyRowsToClipboard="true" :suppressDragLeaveHidesColumns="true" rowSelection="single"
                    @grid-ready="gridReady2" style="height:92%" :defaultColDef="defaultColDef" class='ag-theme-alpine'
                    :rowData="agClousData2" :columnDefs="agClous2" :localeText="localeText1" @rowDragEnd="rowDragEnd">
                </AgGridVuesCopys>
            </template>
        </a-split> -->
    </div>

    <el-dialog v-model="dblclicksShowA2" :width="1080" :height="800" :title="titels" draggable>
        <AgGridVuesCopys :rowHeight="33" :headerHeight="33" :suppressCopyRowsToClipboard="true"
            :suppressDragLeaveHidesColumns="true" @grid-ready="gridReadyA2" style="height: 60vh;width:100%"
            :defaultColDef="defaultColDef" class='ag-theme-alpine' :rowData="tcA2DataList" :columnDefs="tcA2"
            :localeText="localeText1"></AgGridVuesCopys>
        <template #footer>
            <span class="dialog-footer">
                <el-button type="primary" @click="() => dblclicksShowA2 = false">关闭</el-button>
                <el-button type="primary" @click="saveZjt"> 确认 </el-button>
            </span>
        </template>
    </el-dialog>

    <a-modal v-model:visible="visible" :hide-title="true" @cancel="visible = false" :footer="false">
        <a-space>
            <el-button type="primary" @click="tjdd">停机等待</el-button>
            <el-button type="primary" @click="ztzzxyd">暂停转做下单</el-button>
        </a-space>
    </a-modal>

    <el-dialog v-model="dblclicksShowA1" :width="1080" :height="800" title="修改排程" draggable>
        <AgGridVuesCopys :rowDragManaged="true" :animateRows="true" :rowHeight="33" :headerHeight="33"
            :suppressCopyRowsToClipboard="true" :suppressDragLeaveHidesColumns="true" rowSelection="single"
            @grid-ready="gridReady2" style="height:500px" :defaultColDef="defaultColDef2" class='ag-theme-alpine'
            :rowData="agClousData2" :columnDefs="agClous2" :localeText="localeText1" @rowDragEnd="rowDragEnd">
        </AgGridVuesCopys>
        <template #footer>
            <span class="dialog-footer">
                <el-button type="primary" @click="() => dblclicksShowA1 = false">关闭</el-button>
                <el-button type="primary" @click="zjtbc"> 保存 </el-button>
            </span>
        </template>
    </el-dialog>
</template>

<script lang='ts' setup>
import { ref, onMounted } from 'vue'

import { localeText } from '@/api/aggridZw'
import { post } from "@/api/http"
import { Message } from "@arco-design/web-vue"

const  gridOptions= {
    autoSizeColumns: true,
}

const localeText1: any = ref(localeText)

const sizes = ref(0.7)

const gridOption = ref()
const gridReady = (params: any) => {
    gridOption.value = params.api
}

const defaultColDef: any = {
    sortable: true,
    resizable: true,
    filter: true,
}


const defaultColDef2: any = {
    sortable: true,
    resizable: true,
    filter: true,
    flex: 1
}

const agClous = [
    {
        showRowGroup: 'hide_def',
        "checkboxSelection": true,
        "headerCheckboxSelection": true,
        "pinned": "left",
        "width": 50,
        minWidth: 50,
        maxWidth: 50,
        lockPosition: "left",
    },
    {
        headerName: '生产序号',
        field: 'serialNum',
        width: 150
    },
    {
        headerName: '机台号',
        field: 'machineCode',
        width: 150
    },
    {
        headerName: '位置号',
        field: 'area',
        width: 150
    },
    {
        headerName: '生产单号',
        field: 'weavingCode',
        width: 150
    },
    {
        headerName: '织布单号',
        field: 'planOrderCode',
        width: 150
    },
    {
        headerName: '生产状态',
        field: 'productionState',
        width: 150,
        valueGetter: params => {
            return params.data.productionState == 0 ? '等待' : params.data.productionState == 1 ? '生产中' : params.data.productionState == 3 ? '暂停' : '';
        },
    },
    {
        headerName: '插单标识',
        field: 'insertState',
        width: 120,
        "pinned": 'right',
        cellRenderer: {
            template: `<a-checkbox v-model="states" disabled></a-checkbox>`,
            setup(props: any) {
                return {
                    states: props.params.data.insertState == 0 ? false : true
                }
            }
        }
    },
    {
        headerName: '插单时间',
        field: 'insertTime',
        width: 150
    },
    {
        headerName: '暂停标识',
        field: 'stopType',
        width: 150
    },
    {
        headerName: '调机情况',
        field: 'adjustmentState',
        width: 150
    },
    {
        headerName: '领料情况',
        field: 'materialState',
        width: 150
    },
]

const agClousData = ref([])

const letfObj = reactive({
    planOrderCode: '',
    machineCode: '',
    weavingCode: '',
})

const seleCtLeft = async () => {
    const { code, data } = await post({
        url: 'planSingle/planSchedul/getMaInfo',
        data: {
            "planOrderCode": letfObj.planOrderCode,
            "machineCode": letfObj.machineCode,
            "weavingCode": letfObj.weavingCode
        }
    })
    if (code == 200) {
        agClousData.value = data
    } else {
        Message.error("查询失败")
    }
}

const gridOption2 = ref()
const gridReady2 = (params: any) => {
    gridOption2.value = params.api
}

const agClousData2 = ref([])

const agClous2 = [
    {
        field: '', rowDrag: params => {
            return !(params.data.serialNum == 1 || params.data.insertState == 1)
        }, width: 50
    },
    {
        headerName: '机台号',
        field: 'machineCode',
        width: 100
    },
    {
        headerName: '生产序号',
        field: 'serialNum',
        width: 120
    },
    {
        headerName: '生产单号',
        field: 'weavingCode',
        width: 150
    },
    {
        headerName: '生产状态',
        field: 'productionState',
        width: 150,
        valueGetter: params => {
            return params.data.productionState == 0 ? '等待' : params.data.productionState == 1 ? '生产中' : params.data.productionState == 3 ? '暂停' : '';
        },
    },
    {
        headerName: '插单标识',
        field: 'insertState',
        width: 120,
        "pinned": 'right',
        cellRenderer: {
            template: `<a-checkbox v-model="checkBox" @change="cheChange"></a-checkbox>`,
            setup(props: any) {
                const checkBox = ref(props.params.data.insertState == 0 ? false : true)
                const cheChange = (val: any) => {
                    let index1 = 0
                    if (val) {
                        agClousData2.value.forEach((res: any, index: any) => {
                            if (res.id == props.params.data.id) {
                                index1 = index
                                res.insertState = 1
                                let currentDate = new Date();
                                let year = currentDate.getFullYear();
                                let month = currentDate.getMonth() + 1; // 月份从0开始，所以要加1
                                let day = currentDate.getDate();
                                let hours = currentDate.getHours();
                                let minutes = currentDate.getMinutes();
                                let seconds = currentDate.getSeconds();
                                res.insertTime = `${year} -${month} -${day} ${hours}:${minutes}:${seconds}`
                            } else {
                                res.insertState = 0
                            }
                        })
                        let copyA = JSON.parse(JSON.stringify(agClousData2.value[index1].serialNum))
                        agClousData2.value[index1].serialNum = JSON.parse(JSON.stringify(agClousData2.value[1].serialNum))
                        agClousData2.value[1].serialNum = copyA
                        agClousData2.value.sort((a, b) => a.serialNum - b.serialNum);
                        setTimeout(() => {
                            gridOption2.value.setRowData(agClousData2.value);
                        }, 0)
                    } else {
                        props.params.data.insertState = 0
                    }
                }
                return {
                    checkBox,
                    cheChange
                }
            }
        }
    },
    {
        headerName: '插单时间',
        field: 'insertTime',
        width: 150,
        "pinned": 'right',
    },
]

const rowClickeds = async () => {
    if (gridOption.value.getSelectedRows().length == 1) {
        const params = gridOption.value.getSelectedRows()[0]
        const { code, data } = await post({
            url: 'planSingle/planMachineTask/getList',
            data: {
                "machineCode": params.machineCode,
                "neState": 0
            }
        })
        if (code == 200) {
            data.forEach((res: any, index: any) => {
                res.serialNum = index + 1
            })
            agClousData2.value = data
            dblclicksShowA1.value = true
        } else {
            Message.error("查询失败")
        }
    }
}
const rowDragEnd = (event: any) => {
    const sortedData: any = [];
    for (let i = 0; i < event.api.getDisplayedRowCount(); i++) {
        const rowNode = event.api.getDisplayedRowAtIndex(i);
        sortedData.push(rowNode.data);
    }
    console.log(sortedData[0].serialNum)

    if (sortedData[0].serialNum > 1) {
        setTimeout(() => {
            gridOption2.value.setRowData(agClousData2.value)
        }, 0)
    } else if (agClousData2.value[1].insertState == 1 && sortedData[1].serialNum > 2) {
        setTimeout(() => {
            gridOption2.value.setRowData(agClousData2.value)
        }, 0)
    } else {
        sortedData.forEach((res: any, index: any) => {
            res.serialNum = index + 1
        })
        setTimeout(() => {
            gridOption2.value.setRowData(sortedData)
            agClousData2.value = sortedData
        }, 0)
    }
}

const dblclicksShowA2 = ref(false)
const dblclicksShowA1 = ref(false)

const titels = ref('')

const zjtClick = () => {
    titels.value = '转机台详情'
    selectJT()
}

const zjtClicks = () => {
    titels.value = '增加机台详情'
    selectJT()
}

function selectJT() {
    if (gridOption.value.getSelectedRows().length === 0) {
        Message.error('请先勾选')
        return
    }
    post({
        url: 'planSingle/planSchedul/getMachineByOrder',
        data: gridOption.value.getSelectedRows()
    }).then(({ code, message, data }) => {
        if (code == 200) {
            tcA2DataList.value = data
            dblclicksShowA2.value = true
        } else {
            Message.error(message)
        }
    })
}

const gridOptionA2 = ref()
const gridReadyA2 = (params: any) => {
    gridOptionA2.value = params.api
}

let tcA2: any[] = [
    {
        showRowGroup: 'hide_def',
        "headerName": "",
        "checkboxSelection": true,
        "headerCheckboxSelection": true,
        "pinned": "left",
        "width": 50,
        resizable: false,
        filter: false,
        sortable: false,
        minWidth: 50,
        maxWidth: 50,
        lockPosition: "left",
    },
    {
        headerName: '机台编号',
        field: 'machineCode',
        pinned: 'fixed',
    },
    {
        headerName: '类型',
        field: 'machineTypeName',
        pinned: 'fixed',
    },
    {
        headerName: '位置',
        field: 'floorDistrict',
        pinned: 'fixed',
    },
    {
        headerName: '机器名称',
        field: 'machineName',
        pinned: 'fixed',
    },
    {
        headerName: '区域',
        field: 'areaName',
        pinned: 'fixed',
    }
];

const tcA2DataList: any = ref([])

// 转机台确认按钮
const saveZjt = () => {
    if (gridOptionA2.value.getSelectedRows().length === 0) {
        Message.error('请先勾选')
        return
    }
    if (titels.value == '转机台详情') {
        zJt()
    } else {
        zjJt()
    }
}

function zJt() {
    post({
        url: 'planSingle/planSchedul/saveChangeMachineByOrder',
        data: {
            old: gridOption.value.getSelectedRows(),
            newMachineCode: gridOptionA2.value.getSelectedRows()[0].machineCode
        }
    }).then(({ code, message }) => {
        if (code == 200) {
            seleCtLeft()
            dblclicksShowA2.value = false
            agClousData2.value = []
        } else {
            Message.error(message)
        }
    })
}

function zjJt() {
    post({
        url: 'planSingle/planSchedul/getMathInfo',
        data: gridOptionA2.value.getSelectedRows()
    }).then(({ code, message, data }) => {
        if (code == 200) {
            let ob = data
            post({
                url: 'planSingle/planSchedul/saveMachineByOrder',
                data: ob
            }).then(({ code, message, data }) => {
                if (code == 200) {
                    seleCtLeft()
                    dblclicksShowA2.value = false
                    agClousData2.value = []
                } else {
                    Message.error(message)
                }
            })
        } else {
            Message.error(message)
        }
    })
}

const zjtbc = () => {
    post({
        url: 'planSingle/planSchedul/makeNext',
        data: agClousData2.value
    }).then(({ code }) => {
        if (code == 200) {
            Message.success('保存成功')
            agClousData2.value = []
            dblclicksShowA1.value = false
            seleCtLeft()
        }
    })
}

const visible = ref(false)

const ztClick = () => {
    visible.value = true
}

const tjdd = () => {
    post({
        url: 'planSingle/planMachineTask/updateDate',
        data: {
            "id": gridOption.value.getSelectedRows()[0].id,
            "stopType": "停机等待",
            "productionState": 3,
            "suspendState": 2,
        }
    }).then(({ code, message }) => {
        if (code == 200) {
            seleCtLeft()
            visible.value = false
            agClousData2.value = []
            Message.success(message)
        } else {
            Message.error(message)
        }
    })
}

const ztzzxyd = () => {
    post({
        url: 'planSingle/planMachineTask/updateDate',
        data: {
            "id": gridOption.value.getSelectedRows()[0].id,
            "stopType": "暂停转做下单",
            "productionState": 3,
            "suspendState": 2,
        }
    }).then(({ code, message }) => {
        if (code == 200) {
            seleCtLeft()
            visible.value = false
            agClousData2.value = []
            Message.success(message)
        } else {
            Message.error(message)
        }
    })
}

</script>
<style lang='less' scoped></style>